$C.Extend(['Archetype.component.graphicalComponent'],
{
    name : "shuttle5.components.container",
    setup: {
        dependencies: {
            components: {
                header: "shuttle5.components.header",
                chatzone: "shuttle5.components.chatzone",
                sidebar: "shuttle5.components.sidebar",
                footer: "shuttle5.components.footer"
            },
            html: {
                main: "shuttle5.templates.container"
            },
            lib: ["shuttle5.lib.js.strophejs-master.strophe",
                    "shuttle5.lib.js.jquery#scrollTo-min",
                   "shuttle5.lib.js.shuttle5"],
            css: [
                "shuttle5.lib.html.52framework.reset",
                "shuttle5.lib.html.52framework.general",
                "shuttle5.lib.html.52framework.grid",
                "shuttle5.css.layout",
                "shuttle5.css.colors",]


        }


    },
    initialize: function() {
        this.anchor=$(document.body);
        Logger.log('avant');
        
        this.render(this.anchor);
        new this.components.header();
        new this.components.chatzone();
        new this.components.sidebar();
        new this.components.footer();

    connection = new Strophe.Connection(BOSH_SERVICE);
    connection.rawInput = rawInput;
    connection.rawOutput = rawOutput;

    $('#connexion').bind('click', function () {
	var button = this;
	if (button.innerHTML == 'connect') {
	    button.innerHTML = 'disconnect';

	    //connection.connect($('#jid').get(0).value,
		//	       $('#pass').get(0).value,
		//	       onConnect);
        connection.connect('sean@localhost', 'sean', onConnect)
	} else {
	    button.innerHTML = 'connect';
	    connection.disconnect();
	}
    });
    $('#inputSend').bind('click', sendMessage);
    }
});
